<template>
  <div style="margin-top: 10px">
    <el-table
      :height="tableHeight"
      :max-height="tableHeight"
      :data="data"
      border
      style="width: 100%">
      <el-table-column
        align="center"
        type="index"
        label="序号"
        :index="computedTableIndex"
        width="50">
      </el-table-column>
      <el-table-column
        prop="title"
        label="会议标题">
      </el-table-column>
      <el-table-column
        prop="ou"
        label="组织单位">
      </el-table-column>
      <el-table-column
        prop="place"
        label="会议地点">
      </el-table-column>
      <el-table-column
        prop="stringTime"
        align="right"
        label="开始时间">
      </el-table-column>
      <el-table-column
        prop="actived"
        align="center"
        label="是否发布">
        <template v-slot:default="{ row }">
          <el-tag v-if="row.actived == 1">已发布</el-tag>
          <el-tag v-if="row.actived == 0" type="info">未发布</el-tag>
        </template>
      </el-table-column>
      <el-table-column
        label="操作">
        <template v-slot:default="{ row }">
          <el-button type="text" @click="handleDetail(row.id)">详情</el-button>
          <el-button type="text">签到列表</el-button>
          <el-button type="text" @click="handleUpdate(row.id)" :disabled='row.actived == 1'>编辑</el-button>
          <el-button type="text" :disabled='row.summaryFlag == 1'>转纪要</el-button>
          <el-button type="text" @click="handleDelete(row.id)" :disabled='row.actived == 1'>删除</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>

</template>

<script>
export default {
  name: "MeetingTable",
  props: {
    data: Array,
    page: Object,
  },
  data() {
    return {
      tableHeight: window.innerHeight - 300,
    }
  },
  methods: {
    computedTableIndex(index) {
      return (this.page.pageNum - 1) * this.page.pageSize + index + 1;
    },
    handleDetail(row) {
      this.$emit('row-detail', row)
    },
    handleUpdate(row) {
      this.$emit('row-update', row)
    },
    handleDelete(row) {
      this.$emit('row-delete', row)
    },
  },
}
</script>

<style scoped>
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both
}
</style>
